<div class="content-section introduction ">
  <div>
    <span class="feature-title">设备管理<span class="gt">&gt;</span>设备检索  </span>
  </div>
</div>
<div class="content-section implementation GridDemo zktz-equipment-equipment-search">
  <div class="mysearch">
    <div class="ui-g">
      <div class="ui-g-3 ui-sm-12 ">
        <label for="ano" class="ui-g-5 first">设备编码：</label>
        <input id="ano"  class="ui-g-7"  type="text" size="30" pInputText [(ngModel)]="queryModel.ano">
      </div>
      <div class="ui-g-3  ui-sm-12">
        <label for="name" class="ui-g-5" >设备名称：</label>
        <input id="name" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.name">
      </div>
      <div class="ui-g-3 ui-sm-12">
        <button *ngIf="!moreSercheIsShow" pButton type="button" ngClass="ui-sm-12" (click)="toggleMoreSerche()" iconPos="right" icon="fa fa-angle-down" label="更多筛选"
                class="zsl-button-text-secondary more-serch-button"></button>
        <button *ngIf="moreSercheIsShow" pButton type="button" ngClass="ui-sm-12" (click)="toggleMoreSerche()" iconPos="right" icon="fa fa-angle-down fa-rotate-180" label="更多筛选"
                class="zsl-button-text-secondary more-serch-button"></button>
      </div>
      <div class="ui-g-3 option ui-sm-12">
        <button pButton type="button" label="重置" ngClass="ui-sm-12" class="ui-button-secondary sm-margin-bottom" (click)="resetKeyWords()" ></button>
        <button pButton type="button" label="搜索" ngClass="ui-sm-12" (click)="queryByKeyWords()"></button>
      </div>
    </div>
    <div *ngIf="moreSercheIsShow">
      <div class="ui-g">
        <div class="ui-g-3  ui-sm-12">
          <label for="father" class="ui-g-5  first">从属于：</label>
          <input id="father"  class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.father">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="card_position"class="ui-g-5" >所在槽位：</label>
          <input id="card_position" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.card_position">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="asset_no" class="ui-g-5">资产编码：</label>
          <input id="asset_no" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.asset_no">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="brand" class="ui-g-5" >设备品牌：</label>
          <input id="brand" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.brand">
        </div>
      </div>
      <div class="ui-g">

        <div class="ui-g-3 ui-sm-12">
          <label for="modle" class="ui-g-5 first">设备型号：</label>
          <input id="modle" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.modle">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="function" class="ui-g-5">主要功能：</label>
          <input id="function" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.function">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="system" class="ui-g-5" >所属系统：</label>
          <input id="system" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.system">
        </div>
        <div class="ui-g-3  ui-sm-12">
          <label for="status"class="ui-g-5" >设备状态：</label>
          <input id="status" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.status">
        </div>
      </div>
      <div class="ui-g">

        <div class="ui-g-3  ui-sm-12 ui-fluid ">
          <label for="on_line_datetime_start" class="ui-g-5 first">开始时间：</label>
          <div class="ui-g-7 search-calendar">
            <p-calendar name="online"  id="on_line_datetime_start" [showTime]="true"  dateFormat="yy-mm-dd" [showSeconds]="true"  readonlyInput="true" [(ngModel)]="queryModel.on_line_date_start" dataType="string"   [showIcon]="true" [locale]="zh"></p-calendar>
          </div>
        </div>
        <div class="ui-g-3  ui-sm-12 ui-fluid ">
          <label for="on_line_datetime_end"class="ui-g-5" >结束时间：</label>
          <div class="ui-g-7 search-calendar" >
            <p-calendar name="online" id="on_line_datetime_end" [showTime]="true"  dateFormat="yy-mm-dd" [showSeconds]="true"  readonlyInput="true" [(ngModel)]="queryModel.on_line_date_end" dataType="string"
                        [showIcon]="true" [locale]="zh"></p-calendar>
          </div>
        </div>
        <div class="ui-g-3 ui-sm-12 ">
          <label for="room" class="ui-g-5">所在机房：</label>
          <input id="room" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.room">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="cabinet" class="ui-g-5">安装机架：</label>
          <input id="cabinet" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.cabinet">
        </div>
      </div>
      <div class="ui-g">

        <div class="ui-g-3 ui-sm-12">
          <label for="location" class="ui-g-5 first">安装位置：</label>
          <input id="location" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.location">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="belong_dapart" class="ui-g-5">所属部门：</label>
          <input id="belong_dapart" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.belong_dapart">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="belong_dapart_manager" class="ui-g-5">部门管理人：</label>
          <input id="belong_dapart_manager" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.belong_dapart_manager">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="manage_dapart" class="ui-g-5">管理部门：</label>
          <input id="manage_dapart" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.manage_dapart">
        </div>
      </div>
      <div class="ui-g">

        <div class="ui-g-3 ui-sm-12">
          <label for="manager" class="ui-g-5 first">管理人：</label>
          <input id="manager" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.manager">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="ip" class="ui-g-5">管理IP：</label>
          <input id="ip" class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.ip">
        </div>
        <div class="ui-g-3 ui-sm-12">
          <label for="maintain_vender" class="ui-g-5">维保厂家：</label>
          <input id="maintain_vender"  class="ui-g-7" type="text" size="30" pInputText [(ngModel)]="queryModel.maintain_vender">
        </div>
      </div>
    </div>
  </div>
  <p-dataTable emptyMessage="没有数据" [value]="assets" [lazy]="true" [rows]="10" [paginator]="true" [rowsPerPageOptions]="[5,10,20]"
               [totalRecords]="totalRecords" (onLazyLoad)="loadCarsLazy($event)" [stacked]="stacked" [responsive]="true" >
    <!--<p-header>设备信息</p-header>-->
    <p-column  *ngFor="let col of cols" field="{{col.field}}" header="{{col.header}}"></p-column>
    <p-column header="操作">
      <ng-template let-car="rowData" pTemplate="body" let-i="rowIndex">
        <button pButton type="button" label="查看" (click)="viewOption(dataSource[i],i)"></button>
        <button pButton type="button" label="修改" (click)="updateOption(dataSource[i],i)"></button>
        <button pButton type="button" label="查看台账" (click)="viewLedger(dataSource[i])"></button>
      </ng-template>
    </p-column>
  </p-dataTable>
</div>
<app-add-or-update-device *ngIf="showAddOrUpdateMask" [currentAsset]="tempAsset"  (closeAddMask)="closeMask($event)" [state]="state" (updateDev)="updateAsset($event)" ></app-add-or-update-device>
<app-view-detail *ngIf="showViewDetailMask" [currentAsset]="tempAsset"  (closeDetailMask)="closeViewDetail($event)"></app-view-detail>
